<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="index.xhtml">
	<ui:define name="content">
		<h2>
			#{strings['post.header']}
			<h:outputText value="#{postBean.topic.title}" />
		</h2>
		<h:form>
			<h4>
				<h:commandLink value="#{strings['sidebar.addPost']}"
					action="addPost?faces-redirect=true"
					rendered="#{authenticationBean.currentUser != null and topicBean.currentTopic != null}" />
			</h4>
			<h:dataTable id="postTable" styleClass="table" value="#{postBean.postModel}"
				var="post">
				<h:column>

					<p:panel header="#{post.title}"
						footer="Date: #{post.date} - User: #{post.user.username} ">
						<h:graphicImage value="/img/avatars/#{post.user.avatarFilePath}" rendered="#{post.user.avatarFilePath != null}" styleClass="postAvatar" />
						<h:graphicImage value="/img/avatars/default.png" rendered="#{post.user.avatarFilePath == null}" styleClass="postAvatar" />
						<h:outputText value="#{post.text}" />
						<br/>
						<p:graphicImage value="#{mediaBean.image}" rendered="#{post.image != null}">
							<f:param name="id" value="#{post.id}" />
						</p:graphicImage>

						<p:media value="#{mediaBean.video}"
							rendered="#{post.video != null}" player="quicktime" width="300"
							height="250">
							<f:param name="id" value="#{post.id}" />
							<f:param name="autoPlay" value="false"/>
							<f:param name="scale" value="tofit"></f:param>
						</p:media>

						<f:facet name="actions">
							<p:commandButton value="#{post.percentageOfPositiveRatings}%"
							 	id="positiveRating"
								icon="ui-icon-plus"
								disabled="#{authenticationBean.currentUser == null}"
								actionListener="#{ratingBean.ratePositively(post)}"
								update="@(.ui-panel)" />
							<p:commandButton value="#{post.percentageOfNegativeRatings}%"
								id="negativeRating"
								icon="ui-icon-minus"
								disabled="#{authenticationBean.currentUser == null}"
								actionListener="#{ratingBean.rateNegatively(post)}"
								update="@(.ui-panel)" />
						</f:facet>
					</p:panel>
					<p:commandLink value="#{strings['post.comment']}"
						onclick="PF('dlg').show()"
						action="#{commentsBean.savePostToSession(post)}"
						rendered="#{authenticationBean.currentUser != null}">
					</p:commandLink>
					<p:subTable id="commentList"
						value="#{commentsBean.loadComments(post)}" var="comment">
						<f:facet name="header">#{strings['comment.header']}</f:facet>
						<p:column>
						<h:graphicImage value="/img/avatars/#{comment.user.avatarFilePath}" rendered="#{comment.user.avatarFilePath != null}" styleClass="commentAvatar" />
						<h:graphicImage value="/img/avatars/default.png" rendered="#{comment.user.avatarFilePath == null}" styleClass="commentAvatar" />
						#{comment.text}<br></br>
						Date: #{comment.date} - User: #{comment.user.username}</p:column>
					</p:subTable>
				</h:column>
			</h:dataTable>
			<p:dialog header="#{strings['post.comment']}" widgetVar="dlg">
				<h:panelGrid columns="2">
					<h:outputLabel for="txtcomment" value="#{strings['post.comment']}:" />
					<h:inputTextarea id="txtcomment"
						value="#{commentsBean.comment.text}" />
					<h:message for="txtcomment" errorClass="invalid" />
				</h:panelGrid>
				<f:facet name="footer">
					<h:panelGrid columns="2">
						<p:commandButton id="addComment"
							action="#{commentsBean.register}"
							value="#{strings['post.comment']}" oncomplete="PF('dlg').hide()"
							update="@all" />
						<p:commandButton id="cancel" value="#{strings['post.cancel']}"
							oncomplete="PF('dlg').hide()" />
					</h:panelGrid>
				</f:facet>
			</p:dialog>
		</h:form>
	</ui:define>
</ui:composition>
</html>